<template>
    <div>
        <el-dialog :visible.sync="questionVisible" width="980px" :before-close="cancel" class="addQuestion" @open="dialogOpen"
                   :lock-scroll="false">
            <div slot="title" class="dialog-title">
                <span>{{questionTitle}}</span>
                <el-button size="small" type="primary" style="margin-right: 50px" @click="addAnswer">添加答案</el-button>
            </div>
            <knowledge-question @showDialogueList="showDialogueList" ref="knowledgeQuestion" :classId="classId"></knowledge-question>
            <span slot="footer" class="dialog-footer">
                <el-button @click="cancel" size="small" type="text">取消</el-button>
                <el-button @click="submit" type="primary" size="small">保存</el-button>
            </span>
        </el-dialog>
        <!-- 选择会话 -->
        <select-dialogue :selectDialogueVisible.sync="selectDialogueVisible" @chooseDialogue="chooseDialogue" ref="similarQuestionDialog">
        </select-dialogue>
    </div>
</template>

<script>
import knowledgeQuestion from "@/components/knowledgeQuestion/index.vue";
import selectDialogue from "./selectDialogue.vue"
import { vl } from "@/utils/index";
import { addQuestion, editQuestion, findQuesById } from "@/api/knowledge";
export default {
    name: "addQuestion",
    props: {
        questionVisible: Boolean,
        questionTitle: String,
        isReport: {
            type: Boolean,
            default: () => {
                return false;
            }
        }
    },
    data() {
        return {
            classId: "",
            questionId: "",
            selectDialogueVisible: false
        };
    },
    methods: {
        findQuesById(id) {
            this.questionId = id;
            findQuesById({ id }).then((resp) => {
                this.findData = resp.data
                this.$refs.knowledgeQuestion.setQueData(resp.data);
            });
        },
        submit() {
            var data = this.$refs.knowledgeQuestion.getFromData();
            if (data) {
                var param = data;
                if (!vl(this.questionId)) {
                    param.fromSource = 1;
                    addQuestion(param).then((resp) => {
                        if (resp.status == 0) {
                            this.$antMessage.success("添加成功");
                            this.cancel();
                            this.$parent.getQueList();
                        } else {
                            this.$antMessage.warning(resp.message);
                        }
                    });
                } else {
                    param.id = this.questionId;
                    editQuestion(param).then((resp) => {
                        if (resp.status == 0) {
                            this.$antMessage.success("编辑成功");
                            this.cancel();
                            if (this.isReport) { //报表统计的编辑答案
                                this.$parent.getQuestionList();
                            } else {
                                this.$parent.getQueList();
                            }
                        } else {
                            this.$antMessage.warning(resp.message);
                        }
                    });
                }
            }
        },
        cancel() {
            this.questionId = "";
            this.$refs.knowledgeQuestion.clearFromData();
            this.$emit("update:questionVisible", false);
            document.querySelector(".addQuestion .el-dialog__body").scrollTop = 0;
        },
        addAnswer() {
            this.$refs.knowledgeQuestion.addAnswer();
        },
        dialogOpen() {
            this.classId = this.$parent.classId;
        },
        showDialogueList() {
            this.selectDialogueVisible = true
        },
        chooseDialogue(data) {
            this.$refs.knowledgeQuestion.setDialogue(data);
        }
    },
    components: {
        knowledgeQuestion,
        selectDialogue
    },
};
</script>

<style lang="scss">
.addQuestion {
    .el-dialog {
        height: 680px;
    }
    .dialog-title {
        display: flex;
        align-items: center;
        justify-content: space-between;
        flex: 1;
    }
    .el-dialog__body {
        overflow-y: scroll;
    }
}
</style>